<template>
  <!-- python gen: Thu May 13 15:02:38 2021  -->
  <div class="yj-content">
    <div class="yj-search">
      <el-row>
        <el-form
          size="mini"
          ref="searchForm"
          :model="searchForm"
          label-width="100px"
          type="flex"
        >
          <!-- <el-col :sm="6">
            <el-form-item label="name" prop="name">
              <el-input
                style="width: 150px"
                v-model.trim="searchForm.name"
              ></el-input>
            </el-form-item>
          </el-col> -->

          <el-col :sm="6">
            <el-form-item label="检查结果" prop="CHECK_RESULT">
              <el-select
                style="width: 150px"
                v-model.trim="searchForm.CHECK_RESULT"
                placeholder="请选择"
              >
                <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :sm="6">
            <el-form-item>
              <el-button type="primary" @click="getList(true)">查询</el-button>
              <el-button @click="resetForm">重置</el-button>
            </el-form-item>
          </el-col>
        </el-form>
      </el-row>
    </div>

    <!-- 列表开始 -->
    <div class="yj-list-box">
      <div class="yj-btn-box">
        <el-button size="mini" type="primary" @click="goAdd">新增 </el-button>
        <el-button
          size="mini"
          :disabled="multipleSelection.length !== 1"
          type="primary"
          @click="goUpdate"
          >修改
        </el-button>
        <el-button
          size="mini"
          :disabled="!multipleSelection.length > 0"
          type="danger"
          @click="goDelete"
          >删除
        </el-button>

        <el-button size="mini" type="primary" @click="doCheck">检查 </el-button>

        <el-button size="mini" type="primary" @click="goImport"
          >导入
        </el-button>
        <el-button size="mini" type="primary" @click="goExport"
          >导出
        </el-button>
      </div>
      <div>
        <el-table
          :header-cell-style="{
            background: 'linear-gradient(#FFFFFF,#ECECEC)',
            color: '#606266',
          }"
          ref="multipleTable"
          :data="tableData"
          stripe
          tooltip-effect="dark"
          style="width: 100%"
          border
          @selection-change="handleSelectionChange"
          height="500"
        >
          <el-table-column type="selection" fixed align="center">
          </el-table-column>
          <el-table-column label="序号" width="65" fixed align="center">
            <template slot-scope="scope">
              <span>{{ (currentPage - 1) * PageSize + scope.$index + 1 }}</span>
            </template>
          </el-table-column>

          <!-- <el-table-column
            prop="JRXKZH"
            label="金融许可证号"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column> -->
          
         <el-table-column
            prop="JGDM"
            label="机构代码"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column>
    

         <el-table-column
            prop="NBJGH"
            label="内部机构号"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column>
    

         <el-table-column
            prop="JRXKZH"
            label="金融许可证号"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column>
    

         <el-table-column
            prop="JGMC"
            label="机构名称"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column>
    

         <el-table-column
            prop="KHYH"
            label="开户银行"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column>
    

         <el-table-column
            prop="KHHJRXKZH"
            label="开户行金融许可证号"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column>
    

         <el-table-column
            prop="KHHJGDM"
            label="开户行机构代码"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column>
    

         <el-table-column
            prop="KHHLEI"
            label="开户行全球法人识别编码"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column>
    

         <el-table-column
            prop="ZHMC"
            label="账户名称"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column>
    

         <el-table-column
            prop="ZH"
            label="账号"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column>
    

         <el-table-column
            prop="ZHLX1"
            label="账户类型1"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column>
    

         <el-table-column
            prop="ZHLX2"
            label="账户类型2"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column>
    

         <el-table-column
            prop="KHRQ"
            label="开户日期"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column>
    

         <el-table-column
            prop="XHRQ"
            label="销户日期"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column>
    

         <el-table-column
            prop="ZHZT"
            label="账户状态"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column>
    

         <el-table-column
            prop="BZ"
            label="币种"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column>
    

         <el-table-column
            prop="CJRQ"
            label="采集日期"
            width="150"
            show-overflow-tooltip
          >
          </el-table-column>
    
          <el-table-column
            prop="CHECK_RESULT"
            label="检查结果"
            width="250"
            show-overflow-tooltip
          >
            <template slot-scope="scope">
              <div style="color: red" v-if="scope.row.CHECK_RESULT == 0">
                未通过
              </div>
              <div style="color: green" v-else-if="scope.row.CHECK_RESULT == 1">
                通过
              </div>
              <div style="color: red" v-else>
                {{ scope.row.CHECK_RESULT }}
              </div>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="currentPage"
          :page-sizes="pageSizes"
          :page-size="PageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="totalCount"
          class="yj-pagination"
        >
        </el-pagination>
      </div>
    </div>
    <!-- 列表结束 -->

    <!-- 详细信息 开始 -->
    <el-dialog
      height="350"
      fullscreen
      title="详细信息"
      :visible.sync="dialogFormVisible"
    >
      <el-row>
        <el-form
          size="medium"
          type="flex"
          :model="ruleForm"
          :rules="rules"
          ref="ruleForm"
          label-width="200px"
        >
          <!-- 
          <el-col :sm="12">
          <el-form-item prop="JRXKZH" label="金融许可证号">
            <el-input
              style="width: 300px"
              v-model.trim="ruleForm.JRXKZH"
            ></el-input>
          </el-form-item>
        </el-col> -->
          
          <el-col :sm="12">
            <el-form-item prop="JGDM" label="机构代码">
              <el-input
                style="width: 300px"
                v-model.trim="ruleForm.JGDM"
              ></el-input>
            </el-form-item>
          </el-col>
    

          <el-col :sm="12">
            <el-form-item prop="NBJGH" label="内部机构号">
              <el-input
                style="width: 300px"
                v-model.trim="ruleForm.NBJGH"
              ></el-input>
            </el-form-item>
          </el-col>
    

          <el-col :sm="12">
            <el-form-item prop="JRXKZH" label="金融许可证号">
              <el-input
                style="width: 300px"
                v-model.trim="ruleForm.JRXKZH"
              ></el-input>
            </el-form-item>
          </el-col>
    

          <el-col :sm="12">
            <el-form-item prop="JGMC" label="机构名称">
              <el-input
                style="width: 300px"
                v-model.trim="ruleForm.JGMC"
              ></el-input>
            </el-form-item>
          </el-col>
    

          <el-col :sm="12">
            <el-form-item prop="KHYH" label="开户银行">
              <el-input
                style="width: 300px"
                v-model.trim="ruleForm.KHYH"
              ></el-input>
            </el-form-item>
          </el-col>
    

          <el-col :sm="12">
            <el-form-item prop="KHHJRXKZH" label="开户行金融许可证号">
              <el-input
                style="width: 300px"
                v-model.trim="ruleForm.KHHJRXKZH"
              ></el-input>
            </el-form-item>
          </el-col>
    

          <el-col :sm="12">
            <el-form-item prop="KHHJGDM" label="开户行机构代码">
              <el-input
                style="width: 300px"
                v-model.trim="ruleForm.KHHJGDM"
              ></el-input>
            </el-form-item>
          </el-col>
    

          <el-col :sm="12">
            <el-form-item prop="KHHLEI" label="开户行全球法人识别编码">
              <el-input
                style="width: 300px"
                v-model.trim="ruleForm.KHHLEI"
              ></el-input>
            </el-form-item>
          </el-col>
    

          <el-col :sm="12">
            <el-form-item prop="ZHMC" label="账户名称">
              <el-input
                style="width: 300px"
                v-model.trim="ruleForm.ZHMC"
              ></el-input>
            </el-form-item>
          </el-col>
    

          <el-col :sm="12">
            <el-form-item prop="ZH" label="账号">
              <el-input
                style="width: 300px"
                v-model.trim="ruleForm.ZH"
              ></el-input>
            </el-form-item>
          </el-col>
    

          <el-col :sm="12">
            <el-form-item prop="ZHLX1" label="账户类型1">
              <el-input
                style="width: 300px"
                v-model.trim="ruleForm.ZHLX1"
              ></el-input>
            </el-form-item>
          </el-col>
    

          <el-col :sm="12">
            <el-form-item prop="ZHLX2" label="账户类型2">
              <el-input
                style="width: 300px"
                v-model.trim="ruleForm.ZHLX2"
              ></el-input>
            </el-form-item>
          </el-col>
    

          <el-col :sm="12">
            <el-form-item prop="KHRQ" label="开户日期">
              <el-input
                style="width: 300px"
                v-model.trim="ruleForm.KHRQ"
              ></el-input>
            </el-form-item>
          </el-col>
    

          <el-col :sm="12">
            <el-form-item prop="XHRQ" label="销户日期">
              <el-input
                style="width: 300px"
                v-model.trim="ruleForm.XHRQ"
              ></el-input>
            </el-form-item>
          </el-col>
    

          <el-col :sm="12">
            <el-form-item prop="ZHZT" label="账户状态">
              <el-input
                style="width: 300px"
                v-model.trim="ruleForm.ZHZT"
              ></el-input>
            </el-form-item>
          </el-col>
    

          <el-col :sm="12">
            <el-form-item prop="BZ" label="币种">
              <el-input
                style="width: 300px"
                v-model.trim="ruleForm.BZ"
              ></el-input>
            </el-form-item>
          </el-col>
    

          <el-col :sm="12">
            <el-form-item prop="CJRQ" label="采集日期">
              <el-input
                style="width: 300px"
                v-model.trim="ruleForm.CJRQ"
              ></el-input>
            </el-form-item>
          </el-col>
    
        </el-form>
      </el-row>
      <div slot="footer" class="dialog-footer">
        <el-button size="mini" @click="dialogFormVisible = false"
          >取 消</el-button
        >
        <el-button size="mini" type="primary" @click="doSave">确 定</el-button>
      </div>
    </el-dialog>
    <!-- 详细信息 结束 -->
  </div>
</template>

<script src="./zhxxbHome.js"></script>

<style scoped></style>
